Angular 2 Components by Kaufman Nir & Templier Thierry

Author:Kaufman, Nir & Templier, Thierry
Language: eng
Format: epub
Publisher: Packt Publishing
Published: 2016-11-29T16:00:00+00:00

Let's explore how to use them in our code.

NgIf

Just like Angular 1, the NgIf directive will remove or recreate a portion of the DOM based on an expression that we passed. The expression should evaluate to true or false.

Here is how we use ngIf:

[app.component.ts] import { Component } from '@angular/core'; @Component({ selector: 'app-root', template: ` <h1>{{ info.title }}</h1> <h2>{{ info.subtitle || 'alternative text' }}</h2> <h3 *ngIf="showFullName">My name is: {{ getFullName() }}</h3> ` }) export class AppComponent { info: {}; firstName: string; lastName: string; showFullName: boolean; constructor() { this.info = {title: 'app works!'}; this.firstName = 'Nir'; this.lastName = 'Kaufman'; this.showFullName = false; } getFullName(){ return `${this.firstName} ${this.lastName}`; } }

Download

Copyright Disclaimer:
This site does not store any files on its server. We only index and link to content provided by other sites. Please contact the content providers to delete copyright contents if any and email us, we'll remove relevant links or contents immediately.